<template>
  <div style="display: flex;flex-direction: column;gap: 10px;">
    <t-card size="small" style="min-height: 332px">
      <div style="display: flex;gap: 10px;">
        <div
          style="width: 450px;flex-shrink: 0;background-color: #006eff;display: flex;flex-direction: column;align-items: center;justify-content: space-between">
          <!--          <div id="he-plugin-standard"></div>-->
          <iframe allowtransparency="true" frameborder="0" width="450" height="96" scrolling="no"
            src="//tianqi.2345.com/plugin/widget/index.htm?s=2&z=3&t=0&v=0&d=3&bd=0&k=000000&f=ffffff&ltf=009944&htf=cc0000&q=1&e=1&a=1&c=54511&w=385&h=96&align=center"></iframe>
          <t-button v-if="site_tag === 'jtt'" variant="outline" @click="downloadHelp" theme="primary" size="large"
            style="width: 200px;margin-bottom: 20px"><t-icon slot="icon" name="download"></t-icon>用户操作手册</t-button>
        </div>
        <t-card style="width: 100%;height: 300px" class="card_padding" size="small" title="待办事项">
          <t-tabs v-model="tabValue" @change="onApproveTabChange">
            <t-tab-panel v-for="(tab, tabIndex) in approveTabList" :key="tabIndex" :value="tab.value">
              <template #label>
                {{ tab.label }}
                <t-badge style="position: relative" :count="tab.count" show-zero :offset="[-6, 0]"></t-badge>
              </template>
              <t-row class="card">
                <t-col v-for="(item, index) in approvePanelList" :key="index" :span="2">
                  <div class="header">
                    <div class="title">{{ item.title }}</div>
                  </div>
                  <div class="header">
                    <t-link v-if="item.path" @click="toPath(item)" :style="{ fontSize: `36px` }" theme="primary"
                      hover="color">{{
                        item.number
                      }}
                    </t-link>
                    <div v-else :style="{ fontSize: `36px` }">{{ item.number }}</div>
                  </div>
                </t-col>
              </t-row>
            </t-tab-panel>
          </t-tabs>
        </t-card>
        <!--                <div v-if="$store.state.user.roles.includes('kjcspy') || $store.state.user.roles.includes('dwsby')" class="serviceList">-->
        <!--                  <template v-for="(item,index) in serviceProjectList">-->
        <!--                    <t-badge v-if="item.count>0" :count="item.count" :offset="[12, 12]" :key="index">-->
        <!--                      <div class="serviceItem" @click="toPath(item)" :key="index" >-->
        <!--                       <div>{{item.serviceName}}</div>-->
        <!--        &lt;!&ndash;               <div class="money"><div>总经费：</div><div>100万元</div></div>&ndash;&gt;-->
        <!--        &lt;!&ndash;                <div class="money"><div>{{site_tag==='jtt'?'厅拨经费':'集团补助经费'}}：</div><div>100万元</div></div>&ndash;&gt;-->
        <!--                      </div>-->
        <!--                    </t-badge>-->
        <!--                  </template>-->
        <!--                </div>-->
      </div>
    </t-card>
    <t-row :gutter="[16, 16]">
      <t-col :xs="12" :xl="4">
        <t-card size="small" title="通知公告" class="dashboard-chart-card">
          <template #actions>
            <a @click="toPath({ path: '/home/tzgg/tzgg-index' })">更多</a>
          </template>
          <template #content>
            <t-list style="height: 300px;overflow-y: scroll" :split="true" size="small">

              <t-list-item v-for="(item, index) in noticeData" :key="index">
                【{{ item.serviceName }}】<a style="margin-right: 0"
                  @click="dialog.header = '通知公告详情'; dialog.disabled = true; dialog.objId = item.id; dialog.open = true;">{{
                    item.title
                  }}</a>
                <t-icon style="margin-bottom: 4px" v-if="item.pinned === '1'" color="red"
                  name="arrow-triangle-up-filled"></t-icon>
                <template #action>
                  <div style="display: flex;align-items: center">{{ item.publishTime?.substr(0, 10) }} <t-icon
                      style="margin-left: 5px" name="browse" size="16px"></t-icon><span style="margin-left: 5px">{{
                        item.readCount }}</span></div>
                </template>
              </t-list-item>
            </t-list>
          </template>
        </t-card>
      </t-col>
      <t-col :xs="12" :xl="4">
        <t-card size="small" title="帮助文档" class="dashboard-chart-card">
          <template #actions>
            <a @click="toPath({ path: '/home/tzgg/help-index' })">更多</a>
          </template>
          <template #content>
            <t-list style="height: 300px;overflow-y: scroll" :split="true" size="small">
              <t-list-item v-for="(item, index) in helpData" :key="index">【{{ item.serviceName }}】<a
                  style="margin-right: 0"
                  @click="dialog.header = '帮助文档详情'; dialog.disabled = true; dialog.objId = item.id; dialog.open_help = true;">{{
                    item.title
                  }}</a>
                <t-icon style="margin-bottom: 4px" v-if="item.pinned === '1'" color="red"
                  name="arrow-triangle-up-filled"></t-icon>
                <template #action>
                  <div style="display: flex;align-items: center">{{ item.publishTime?.substr(0, 10) }} <t-icon
                      style="margin-left: 5px" name="browse" size="16px"></t-icon><span style="margin-left: 5px">{{
                        item.readCount }}</span></div>
                </template>
              </t-list-item>
            </t-list>
          </template>
        </t-card>
      </t-col>
      <t-col :xs="12" :xl="4">
        <t-card size="small" title="系统消息" class="dashboard-chart-card">
          <template #actions>
            <a @click="toPath({ path: '/home/tzgg/xxtz-index' })">更多</a>
          </template>
          <template #content>
            <t-list style="height: 300px;overflow-y: scroll" :split="true" size="small">
              <t-list-item style="display: flex;flex-direction: column" v-for="(item, index) in messageData"
                :key="index">{{ item.serviceName }}<a>{{ item.title }}</a>
                <template #action>{{ item.createTime?.substr(0, 10) }}</template>
                <div>{{ item.content }}</div>
              </t-list-item>
            </t-list>
          </template>
        </t-card>
      </t-col>
    </t-row>

    <t-row v-if="$store.state.user.roles.includes('dwsby') || $store.state.user.roles.includes('zjk')"
      :gutter="[16, 16]">
      <t-col :xs="12" :xl="12">
        <t-card title="我的项目">

          <template v-for="(item, index) in serviceProjectList">
            <t-badge v-if="item.count > 0" :max-count="10000" :count="item.count" :offset="[14, 12]" :key="index">
              <div class="serviceItem" @click="toPath(item)" :key="index">
                <div>{{ item.serviceName }}</div>
                <!--               <div class="money"><div>总经费：</div><div>100万元</div></div>-->
                <!--                <div class="money"><div>{{site_tag==='jtt'?'厅拨经费':'集团补助经费'}}：</div><div>100万元</div></div>-->
              </div>
            </t-badge>
          </template>
        </t-card>
      </t-col>
    </t-row>

    <!-- <t-row v-if="$store.state.user.roles.includes('kjcspy') || $store.state.user.roles.includes('dwgly') || $store.state.user.roles.includes('admin')"
           :gutter="[16, 16]">
      <t-col :xs="12" :xl="12">
        <t-card title="单位项目">
          <template #content>
            <div style="display: flex;gap: 10px;" class="serviceList">
              <template v-for="(item,index) in serviceProjectList">
                <t-badge v-if="item.count>0" :max-count="10000" :count="item.count" :offset="[14, 12]" :key="index">
                  <div class="serviceItem" @click="toPath(item)" :key="index" >
                    <div>{{item.serviceName}}</div>
                  </div>
                </t-badge>
              </template>
            </div>
          </template>
        </t-card>
      </t-col>
    </t-row> -->

    <t-row v-if="$store.state.user.roles.includes('dwsby') || $store.state.user.roles.includes('zjk')"
      :gutter="[16, 16]">
      <t-col :xs="12" :xl="12">
        <t-card title="我的成果">
          <chart-view @click="onMyCG" :chartOption="chatOption0" :autoResize="false" height="326px" />
        </t-card>
      </t-col>
    </t-row>

    <!-- <t-row v-if="$store.state.user.roles.includes('kjcspy') || $store.state.user.roles.includes('dwgly') || $store.state.user.roles.includes('admin')"
           :gutter="[16, 16]">
      <t-col :xs="12" :xl="12">
        <t-card title="单位成果">
          <chart-view @click="onMyCG" :chartOption="chatOption0"
                      :autoResize="false" height="326px"/>
        </t-card>
      </t-col>
    </t-row> -->



    <tzgg-detail :disabled="dialog.disabled" :header="dialog.header" :objId="dialog.objId" :visible.sync="dialog.open"
      v-if="dialog.open"></tzgg-detail>
    <help-detail :disabled="dialog.disabled" :header="dialog.header" :objId="dialog.objId"
      :visible.sync="dialog.open_help" v-if="dialog.open_help"></help-detail>

  </div>
</template>

<script>
import TzggDetail from "./tzgg/components/tzgg-detail.vue";
import HelpDetail from "./tzgg/components/help-detail.vue";


export default {
  name: "home",
  components: {
    TzggDetail,
    HelpDetail
  },
  data () {
    return {
      serviceProjectList: [],
      site_tag: import.meta.env.VITE_SITE_TAG,
      tabValue: '0',
      approveTabList: [
        { label: '科技项目', value: '0', count: 0 },
        // {label: '标准化', value: '1', count: 0},
        // {label: '示范工程', value: '2', count: 0},
        // {label: '微创新', value: '3', count: 0},
        // {label: '成果推广', value: '4', count: 0},
        // {label: '攻关需求', value: '5', count: 0},
        // {label: '科普综合', value: '6', count: 0},
      ],
      approveTabListMap: {},
      approveKjxmPanelList: [],
      approveKjsfPanelList: [],
      approveBzhPanelList: [],
      approveWcxPanelList: [],
      approveCgtgPanelList: [],
      approveGgxqPanelList: [],
      approveKpzhPanelList: [],
      chatOption0: {},
      dialog: {
        disabled: false,
        header: '',
        objId: null,
        open: false,
        open_help: false
      },
      noticeData: [],
      helpData: [],
      messageData: [],
      queryParams: {
        pageNum: 1,
        pageSize: 20,
        // isRead: '0'
      },
    }
  },
  computed: {
    approvePanelList () {
      if (this.tabValue === '0') {
        return this.approveKjxmPanelList;
      } else if (this.tabValue === '1') {
        return this.approveBzhPanelList;
      } else if (this.tabValue === '2') {
        return this.approveKjsfPanelList;
      } else if (this.tabValue === '3') {

        return this.approveWcxPanelList;
      } else if (this.tabValue === '4') {
        // 成果推广
        return this.approveCgtgPanelList;
      } else if (this.tabValue === '5') {
        // 攻关需求
        return this.approveGgxqPanelList;
      } else if (this.tabValue === '6') {
        // 科普综合
        return this.approveKpzhPanelList;
      }
    }
  },
  created () {
    // window.WIDGET = {
    //   "CONFIG": {
    //     "layout": "1",
    //     "width": "450",
    //     "height": "300",
    //     "background": "4",
    //     "dataColor": "FFFFFF",
    //     "backgroundColor": "006eff",
    //     "key": "acfe62b07d214d81bafe518922f270e5"
    //   }
    // }
    // const script = document.createElement('script');
    // script.type = 'text/javascript';
    // script.src = 'https://app2.weatherwidget.org/js/?id=ww_6ffa55ea1686f';
    // document.getElementsByTagName('head')[0].appendChild(script);



    this.getKjxmApproveData();
    this.approveTabListMap.kjxm = this.approveTabList.length - 1;
    if (this.site_tag === 'jt') {
      this.approveTabList.push({ label: '微创新', value: '3', count: 0 })
      this.approveTabListMap.wcx = this.approveTabList.length - 1;
      this.getWcxApproveData();
    }
    if (this.site_tag === 'jtt') {
      this.approveTabList.push({ label: '标准化', value: '1', count: 0 })
      this.approveTabListMap.bzh = this.approveTabList.length - 1;
      this.approveTabList.push({ label: '示范工程', value: '2', count: 0 })
      this.approveTabListMap.kjsf = this.approveTabList.length - 1;
      this.approveTabList.push({ label: '成果推广', value: '4', count: 0 })
      this.approveTabListMap.cgtg = this.approveTabList.length - 1;
      this.approveTabList.push({ label: '攻关需求', value: '5', count: 0 })
      this.approveTabListMap.ggxq = this.approveTabList.length - 1;
      this.getBzhApproveData();
      this.getKjsfApproveData();
      this.getCgtgApproveData();
      this.getGgxqApproveData();
    }

    // if (this.$store.state.user.roles.includes('zjk')) {
    this.approveTabList.push({ label: '科普综合', value: '6', count: 0 })
    this.getKpzhApproveData();
    this.approveTabListMap.kpzh = this.approveTabList.length - 1;
    // }


    this.getNoticeList();
    this.getHelpList();
    this.getMessageList();
    if (this.$store.state.user.roles.includes('dwsby') || this.$store.state.user.roles.includes('zjk')) {
      this.getMyCg();
      this.getBusinessCount();
    }
    if (this.$store.state.user.roles.includes('kjcspy') || this.$store.state.user.roles.includes('dwgly') || this.$store.state.user.roles.includes('admin')) {
      this.getDeptCg();
      this.getDeptBusinessCount();
    }
  },
  methods: {
    downloadHelp () {
      if (this.site_tag === 'jtt') {
        window.open("http://111.75.227.156:20101/view/模板/用户操作手册.zip");
      } else {
        window.open("http://60.204.134.246/view/模板/用户操作手册.zip");
      }
    },
    getDeptCg () {
      this.$api.system.home.getDeptCg().then(response => {
        const xdata = Object.keys(response.data)
        const vdata = Object.values(response.data)
        const seriesList = []
        if (Object.keys(vdata).length > 0) {
          Object.keys(vdata[0]).forEach(val => {
            seriesList.push({
              name: val,
              data: []
            })
          })
        }
        seriesList.forEach((val, index) => {
          vdata.forEach((val2, index2) => {
            // 添加额外的参数
            seriesList[index].data.push({ value: val2[seriesList[index].name], name: val2[seriesList[index].name] })
          })
        })
        const series = seriesList.map(val => ({
          name: val.name,
          type: 'bar',
          stack: 'total',
          label: {
            show: true,
            // position: 'top',
            formatter (d) {
              return d.data.value > 0 ? `${d.data.value}个` : '';
            },
          },
          // emphasis: {
          //   focus: 'series'
          // },
          data: val.data
        }))
        this.chatOption0 = this.$eChartFn.getBarChart(xdata, [], {
          series,
        });
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    getKjxmApproveData () {
      this.approveKjxmPanelList = [];
      if (this.$store.state.user.roles.includes('kjcspy') || this.$store.state.user.roles.includes('dwgly') || this.$store.state.user.roles.includes('admin')) {
        this.$api.kjxm.home.getGlyGztCount().then(response => {
          this.approveKjxmPanelList = [
            {
              title: '待我审批',
              number: response.data.approveCount,
              path: '/kjxm/approve/approve-my',
              query: {}
            },
          ]
          this.$set(this.approveTabList[this.approveTabListMap.kjxm], 'count', response.data.totalCount);
        }).catch((e) => {
          this.$message.error(e.toString());
        });
      } else {
        // 如果是专家和申报 双重角色
        if (this.$store.state.user.roles.includes('zjk') && this.$store.state.user.roles.includes('dwsby')) {
          this.$api.kjxm.home.getPtGztCount().then(response => {
            this.approveKjxmPanelList = [
              {
                title: '待大纲编制',
                number: response.data.dGgCount,
                path: '/kjxm/outline/project-my',
                query: {}
              },
              {
                title: '待任务书签订',
                number: response.data.dHtCount,
                path: '/kjxm/contract/project-my',
                query: {}
              },
              {
                title: '待验收申请',
                number: response.data.dYsCount,
                path: '/kjxm/acceptance/project-my',
                query: {}
              },
              {
                title: '待填写验收意见书',
                number: response.data.dYjsCount,
                path: '/kjxm/acceptance/project-opinion-my',
                query: {}
              },
              {
                title: '待上传验收意见书',
                number: response.data.dYswcCount,
                path: '/kjxm/acceptance/project-opinion-my',
                query: {}
              },
            ]
            const total1 = response.data.totalCount;
            // 查询专家的
            this.$api.kjxm.home.getZjGztCount().then(response => {
              this.approveKjxmPanelList.push(...[
                {
                  title: '待立项盲审',
                  number: response.data.lxCount,
                  path: '/zjk/review/review-my',
                  query: {
                    tabValue: '0'
                  }
                },
                {
                  title: '待大纲评审',
                  number: response.data.dgCount,
                  path: '/zjk/review/review-my',
                  query: {
                    tabValue: '0'
                  }
                },
                {
                  title: '待验收评审',
                  number: response.data.ysCount,
                  path: '/zjk/review/review-my',
                  query: {
                    tabValue: '0'
                  }
                }
              ])
              this.$set(this.approveTabList[this.approveTabListMap.kjxm], 'count', response.data.totalCount + total1);
            }).catch((e) => {
              this.$message.error(e.toString());
            });
          }).catch((e) => {
            this.$message.error(e.toString());
          });

        } else {
          if (this.$store.state.user.roles.includes('zjk')) {
            this.$api.kjxm.home.getZjGztCount().then(response => {
              this.approveKjxmPanelList = [
                {
                  title: '待立项盲审',
                  number: response.data.lxCount,
                  path: '/zjk/review/review-my',
                  query: {
                    tabValue: '0'
                  }
                },
                {
                  title: '待大纲评审',
                  number: response.data.dgCount,
                  path: '/zjk/review/review-my',
                  query: {
                    tabValue: '0'
                  }
                },
                {
                  title: '待验收评审',
                  number: response.data.ysCount,
                  path: '/zjk/review/review-my',
                  query: {
                    tabValue: '0'
                  }
                }
              ]
              this.$set(this.approveTabList[this.approveTabListMap.kjxm], 'count', response.data.totalCount);
            }).catch((e) => {
              this.$message.error(e.toString());
            });
          } else if (this.$store.state.user.roles.includes('dwsby')) {
            this.$api.kjxm.home.getPtGztCount().then(response => {
              this.approveKjxmPanelList = [
                {
                  title: '待大纲编制',
                  number: response.data.dGgCount,
                  path: '/kjxm/outline/project-my',
                  query: {}
                },
                {
                  title: '待任务书签订',
                  number: response.data.dHtCount,
                  path: '/kjxm/contract/project-my',
                  query: {}
                },
                {
                  title: '待验收申请',
                  number: response.data.dYsCount,
                  path: '/kjxm/acceptance/project-my',
                  query: {}
                },
                {
                  title: '待填写验收意见书',
                  number: response.data.dYjsCount,
                  path: '/kjxm/acceptance/project-opinion-my',
                  query: {}
                },
                {
                  title: '待上传验收意见书',
                  number: response.data.dYswcCount,
                  path: '/kjxm/acceptance/project-opinion-my',
                  query: {}
                },
              ]
              this.$set(this.approveTabList[this.approveTabListMap.kjxm], 'count', response.data.totalCount);
            }).catch((e) => {
              this.$message.error(e.toString());
            });
          }

        }
      }
    },
    getBzhApproveData () {
      this.approveBzhPanelList = [];
      if (this.$store.state.user.roles.includes('kjcspy') || this.$store.state.user.roles.includes('dwgly') || this.$store.state.user.roles.includes('admin')) {
        this.$api.bzh.home.getGlyGztCount().then(response => {
          this.approveBzhPanelList = [
            {
              title: '待我审批',
              number: response.data.approveCount,
              path: '/bzh/approve/approve-my',
              query: {}
            },
          ]
          this.$set(this.approveTabList[this.approveTabListMap.bzh], 'count', response.data.totalCount);
        }).catch((e) => {
          this.$message.error(e.toString());
        });
      } else {
        // 如果是专家和申报 双重角色
        if (this.$store.state.user.roles.includes('zjk') && this.$store.state.user.roles.includes('dwsby')) {
          this.$api.bzh.home.getPtGztCount().then(response => {
            this.approveBzhPanelList = [
              {
                title: '待意见汇总',
                number: response.data.dYjhzCount,
                path: '/bzh/opinion/opinion-my',
                query: {}
              },
              {
                title: '待报审',
                number: response.data.dBsCount,
                path: '/bzh/report/report-my',
                query: {}
              },
              {
                title: '待登记',
                number: response.data.dDjCount,
                path: '/bzh/register/register-place',
                query: {}
              },
            ]
            const total1 = response.data.totalCount;
            // 查询专家的
            this.$api.bzh.home.getZjGztCount().then(response => {
              this.approveBzhPanelList.push(...[
                {
                  title: '待评审',
                  number: response.data.tjjsznCount,
                  path: '/zjk/review/review-my',
                  query: {
                    tabValue: '1'
                  }
                },
              ])
              this.$set(this.approveTabList[this.approveTabListMap.bzh], 'count', response.data.totalCount + total1);
            }).catch((e) => {
              this.$message.error(e.toString());
            });
          }).catch((e) => {
            this.$message.error(e.toString());
          });

        } else {
          if (this.$store.state.user.roles.includes('zjk')) {
            this.$api.bzh.home.getZjGztCount().then(response => {
              this.approveBzhPanelList = [
                {
                  title: '待评审',
                  number: response.data.tjjsznCount,
                  path: '/zjk/review/review-my',
                  query: {
                    tabValue: '1'
                  }
                },
              ]
              this.$set(this.approveTabList[this.approveTabListMap.bzh], 'count', response.data.totalCount);
            }).catch((e) => {
              this.$message.error(e.toString());
            });
          } else if (this.$store.state.user.roles.includes('dwsby')) {
            this.$api.bzh.home.getPtGztCount().then(response => {
              this.approveBzhPanelList = [
                {
                  title: '待意见汇总',
                  number: response.data.dYjhzCount,
                  path: '/bzh/opinion/opinion-my',
                  query: {}
                },
                {
                  title: '待报审',
                  number: response.data.dBsCount,
                  path: '/bzh/report/report-my',
                  query: {}
                },
                {
                  title: '待登记',
                  number: response.data.dDjCount,
                  path: '/bzh/register/register-place',
                  query: {}
                },
              ]
              this.$set(this.approveTabList[this.approveTabListMap.bzh], 'count', response.data.totalCount);
            }).catch((e) => {
              this.$message.error(e.toString());
            });
          }

        }
      }
    },
    getKjsfApproveData () {
      this.approveKjsfPanelList = [];
      if (this.$store.state.user.roles.includes('kjcspy') || this.$store.state.user.roles.includes('dwgly') || this.$store.state.user.roles.includes('admin')) {
        this.$api.kjsf.home.getGlyGztCount().then(response => {
          this.approveKjsfPanelList = [
            {
              title: '待我审批',
              number: response.data.approveCount,
              path: '/kjsf/approve/approve-my',
              query: {}
            },
          ]
          this.$set(this.approveTabList[this.approveTabListMap.kjsf], 'count', response.data.totalCount);
        }).catch((e) => {
          this.$message.error(e.toString());
        });
      } else {
        // 如果是专家和申报 双重角色
        if (this.$store.state.user.roles.includes('zjk') && this.$store.state.user.roles.includes('dwsby')) {
          this.$api.kjsf.home.getPtGztCount().then(response => {
            this.approveKjsfPanelList = [
              {
                title: '待实施方案填写',
                number: response.data.dSsfaCount,
                path: '/kjsf/implement/implement-plan-my',
                query: {

                }
              },
              // {
              //   title: '待预验收申请',
              //   number: 0,
              //   path: '/kjxm/contract/project-my',
              //   query: {}
              // },
              // {
              //   title: '待验收申请',
              //   number: 0,
              //   path: '/kjxm/acceptance/project-my',
              //   query: {}
              // },
            ]
            const total1 = response.data.totalCount;
            // 查询专家的
            this.$api.kjsf.home.getZjGztCount().then(response => {
              this.approveKjsfPanelList.push(...[
                {
                  title: '待立项评审',
                  number: response.data.lxCount,
                  path: '/zjk/review/review-my',
                  query: {
                    tabValue: '2'
                  }
                },
                {
                  title: '待实施方案评审',
                  number: response.data.ssfaCount,
                  path: '/zjk/review/review-my',
                  query: {
                    tabValue: '2'
                  }
                },
                // {
                //   title: '待预验收评审',
                //   number: 0,
                //   path: '/zjk/review/review-my',
                //   query: {}
                // },
                // {
                //   title: '待验收评审',
                //   number: 0,
                //   path: '/zjk/review/review-my',
                //   query: {}
                // }
              ])
              this.$set(this.approveTabList[this.approveTabListMap.kjsf], 'count', response.data.totalCount + total1);
            }).catch((e) => {
              this.$message.error(e.toString());
            });
          }).catch((e) => {
            this.$message.error(e.toString());
          });

        } else {
          if (this.$store.state.user.roles.includes('zjk')) {
            this.$api.kjsf.home.getZjGztCount().then(response => {
              this.approveKjsfPanelList = [
                {
                  title: '待立项评审',
                  number: response.data.lxCount,
                  path: '/zjk/review/review-my',
                  query: {
                    tabValue: '2'
                  }
                },
                {
                  title: '待实施方案评审',
                  number: response.data.ssfaCount,
                  path: '/zjk/review/review-my',
                  query: {
                    tabValue: '2'
                  }
                },
              ]
              this.$set(this.approveTabList[this.approveTabListMap.kjsf], 'count', response.data.totalCount);
            }).catch((e) => {
              this.$message.error(e.toString());
            });
          } else if (this.$store.state.user.roles.includes('dwsby')) {
            this.$api.kjsf.home.getPtGztCount().then(response => {
              this.approveKjsfPanelList = [
                {
                  title: '待实施方案填写',
                  number: response.data.dSsfaCount,
                  path: '/kjsf/implement/implement-plan-my',
                  query: {}
                },
              ]
              this.$set(this.approveTabList[this.approveTabListMap.kjsf], 'count', response.data.totalCount);
            }).catch((e) => {
              this.$message.error(e.toString());
            });
          }

        }
      }
    },
    getWcxApproveData () {
      this.approveWcxPanelList = [];
      if (this.$store.state.user.roles.includes('kjcspy') || this.$store.state.user.roles.includes('dwgly') || this.$store.state.user.roles.includes('admin')) {
        this.$api.wcx.home.getGlyGztCount().then(response => {
          this.approveWcxPanelList = [
            {
              title: '待我审批',
              number: response.data.approveCount,
              path: '/wcx/approve/approve-my',
              query: {}
            },
            {
              title: '待我推荐',
              number: response.data.waitRecommendCount,
              path: '/wcx/recommend/recommend-my',
              query: {}
            },
          ]
          this.$set(this.approveTabList[this.approveTabListMap.wcx], 'count', response.data.totalCount);
        }).catch((e) => {
          this.$message.error(e.toString());
        });
      } else {
        // 如果是专家和申报 双重角色
        if (this.$store.state.user.roles.includes('zjk') && this.$store.state.user.roles.includes('dwsby')) {
          this.$api.wcx.home.getPtGztCount().then(response => {
            this.approveWcxPanelList = [
              {
                title: '待上传盖章申报书',
                number: response.data.dSbsscCount,
                path: '/wcx/apply/innovation-my',
                query: {}
              },
            ]
            const total1 = response.data.totalCount;
            // 查询专家的
            this.$api.wcx.home.getZjGztCount().then(response => {
              this.approveWcxPanelList.push(...[{
                title: '待评审',
                number: response.data.lxCount,
                path: '/zjk/review/review-my',
                query: {
                  tabValue: '3'
                }
              },
              ])
              this.$set(this.approveTabList[this.approveTabListMap.wcx], 'count', response.data.totalCount + total1);
            }).catch((e) => {
              this.$message.error(e.toString());
            });
          }).catch((e) => {
            this.$message.error(e.toString());
          });

        } else {
          if (this.$store.state.user.roles.includes('zjk')) {
            this.$api.wcx.home.getZjGztCount().then(response => {
              this.approveWcxPanelList = [{
                title: '待立项评审',
                number: response.data.lxCount,
                path: '/zjk/review/review-my',
                query: {
                  tabValue: '3'
                }
              },
              ]
              this.$set(this.approveTabList[this.approveTabListMap.wcx], 'count', response.data.totalCount);
            }).catch((e) => {
              this.$message.error(e.toString());
            });
          } else if (this.$store.state.user.roles.includes('dwsby')) {
            this.$api.wcx.home.getPtGztCount().then(response => {
              this.approveWcxPanelList = [
                {
                  title: '待上传盖章申报书',
                  number: response.data.dSbsscCount,
                  path: '/wcx/apply/innovation-my',
                  query: {}
                },
              ]
              this.$set(this.approveTabList[this.approveTabListMap.wcx], 'count', response.data.totalCount);
            }).catch((e) => {
              this.$message.error(e.toString());
            });
          }

        }
      }
    },
    getCgtgApproveData () {
      this.approveCgtgPanelList = [];
      this.$api.zjk.expert.cgzhList('0', {}).then((response) => {
        this.approveCgtgPanelList = [
          {
            title: '待我评审',
            number: response.total,
            path: '/zjk/review/review-my',
            query: {}
          },
        ]
        this.approveTabList[this.approveTabList.findIndex((item) => item.value === '4')].count = response.total
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    getGgxqApproveData () {
      this.approveGgxqPanelList = [];
      this.$api.zjk.expert.ggxqList('0', {}).then((response) => {
        this.approveGgxqPanelList = [
          {
            title: '待我评审',
            number: response.total,
            path: '/zjk/review/review-my',
            query: {}
          },
        ]
        this.approveTabList[this.approveTabList.findIndex((item) => item.value === '5')].count = response.total
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    getKpzhApproveData () {
      this.approveKpzhPanelList = [];
      this.$api.zjk.expert.homeKpzhNum().then((response) => {
        this.approveKpzhPanelList = [
          {
            title: '待我评审',
            number: response.data.approveCount,
            path: '/kpzh/approve/approve-my',
            query: {}
          },
        ]
        this.approveTabList[this.approveTabList.findIndex((item) => item.value === '6')].count = response.data.totalCount
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    onApproveTabChange (val) {
      if (val === '0') {
        this.getKjxmApproveData();
      }
      if (val === '1') {
        this.getBzhApproveData();
      }
      if (val === '2') {
        this.getKjsfApproveData();
      }
      if (this.site_tag === 'jt' && val === '3') {
        this.getWcxApproveData();
      }
      if (val === '4') {
        this.getCgtgApproveData();
      }
      if (val === '5') {
        this.getGgxqApproveData();
      }
    },
    toPath (item) {
      this.$router.push({
        path: item.path,
        query: item.query
      });
    },
    getBusinessCount () {
      this.$api.system.home.getBusinessCount().then(response => {
        const pathDict = {
          'kjxm': '/kjxm/pm/project-my',
          'bzh': '/bzh/standard/standard-my',
          'kjsf': '/kjsf/project/project-my',
          'wcx': '/wcx/innovation/innovation-my',
        }
        this.serviceProjectList = response.data.map(val => ({
          ...val,
          path: pathDict[val.serviceCode]
        }))
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    getDeptBusinessCount () {
      this.$api.system.home.getDeptBusinessCount().then(response => {
        const pathDict = {
          'kjxm': '/kjxm/pm/project-my',
          'bzh': '/bzh/standard/standard-my',
          'kjsf': '/kjsf/project/project-my',
          'wcx': '/wcx/innovation/innovation-my',
        }
        this.serviceProjectList = response.data.map(val => ({
          ...val,
          path: pathDict[val.serviceCode]
        }))
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    getMessageList () {
      this.$api.system.message.list(this.queryParams).then(response => {
        this.messageData = response.rows;
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    getNoticeList () {
      this.$api.system.tzgg.list(this.queryParams).then(response => {
        this.noticeData = response.rows;
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    getHelpList () {
      this.$api.system.tzgg.helpList(this.queryParams).then(response => {
        this.helpData = response.rows;
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    getMyCg () {
      this.$api.system.home.getMyCg().then(response => {
        const xdata = Object.keys(response.data)
        const vdata = Object.values(response.data)
        const seriesList = []
        if (Object.keys(vdata).length > 0) {
          Object.keys(vdata[0]).forEach(val => {
            seriesList.push({
              name: val,
              data: []
            })
          })
        }
        seriesList.forEach((val, index) => {
          vdata.forEach((val2, index2) => {
            // 添加额外的参数
            seriesList[index].data.push({ value: val2[seriesList[index].name], name: val2[seriesList[index].name] })
          })
        })
        const series = seriesList.map(val => ({
          name: val.name,
          type: 'bar',
          stack: 'total',
          label: {
            show: true,
            // position: 'top',
            formatter (d) {
              return d.data.value > 0 ? `${d.data.value}个` : '';
            },
          },
          // emphasis: {
          //   focus: 'series'
          // },
          data: val.data
        }))
        this.chatOption0 = this.$eChartFn.getBarChart(xdata, [], {
          series,
        });
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    onMyCG (val) {

    }
  }
}
</script>

<style lang="less" scoped>
.card_padding {
  /deep/ .t-card__body {
    padding: 0 10px;
  }

  /deep/ .t-badge--circle {
    position: relative;
  }
}

.card {
  .header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px 10px;
    position: relative;

    .title {
      font: var(--td-font-title-medium);
      color: var(--td-text-color-primary);
      margin-right: var(--td-comp-margin-l);
      word-break: break-all;
    }
  }
}

/deep/ .wv-lt-refresh {
  display: none;
}

.serviceList {
  //display: flex;
  //flex-wrap: wrap;
  gap: 10px;
  height: 200px;
  flex: 1;
  overflow-y: auto;
  display: grid;
  //grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-template-columns: repeat(4, minmax(200px, 1fr));
  grid-gap: 10px;

  .serviceItem {
    cursor: pointer;
    padding: 10px;
    background: #006eff;
    border-radius: 3px;
    height: 70px;
    //width: 180px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 20px;
    font-weight: bold;
    flex-direction: column;

    .money {
      display: flex;
      width: 100%;
      justify-content: space-between;
      font-size: 10px;
      line-height: 14px;
    }
  }
}
</style>
